<extend name="./public/frame.html"/>
<block name="content">
    <form class="layui-form layui-form-pane1" action="" method="post">
        <div class="layui-form-item">
            <label class="layui-form-label">广告名称</label>
            <div class="layui-input-block">
                <input type="text" name="title" lay-verify="required|title" required placeholder="请输入活动名称" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">广告图片</label>
            <div class="layui-input-block">
                <button type="button" class="layui-btn" id="test1">
                    <i class="layui-icon">&#xe67c;</i>上传图片
                </button>
            </div>
        </div>
        <div class="layui-form-item" id="img_url" style="display: none">
            <label class="layui-form-label"> </label>
            <div class="layui-input-block">
                <img src="" alt="" style="width: 300px;height: 400px">
                <input type="hidden" name="img_url">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">内容URL</label>
            <div class="layui-input-block">
                <input type="text" name="content_url" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">开始日期</label>
                <div class="layui-input-inline" style="width: 200px;">
                    <input type="text" name="start_time" lay-verify="required|start_time" class="layui-input" id="test6-1">
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">结束日期</label>
                <div class="layui-input-inline" style="width: 200px;">
                    <input type="text" name="end_time" lay-verify="required|end_time" class="layui-input" id="test6-2">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">活动类型</label>
                <div class="layui-input-inline" style="width: 200px;">
                    <select name="order_type">
                        <volist name="ad_order_type" id="vo">
                            <option value="{$key}">{$vo}</option>
                        </volist>
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">广告城市</label>
                <div class="layui-inline">
                    <select name="province_id" id="province_id" class="layui-input" lay-filter="province" style="width: 120px;" onclick="getProvinceList();">
                        <option value="">请选择省份</option>
                        <?php foreach($provinceList as $key=>$value):?>
                        <option value="<?php echo $value['region_id'];?>"><?php echo $value['region_name'];?></option>
                        <?php endforeach;?>
                    </select>
                </div>
                <div class="layui-inline">
                    <select name="city_id" id="city_id" class="layui-input" lay-filter="city_id" style="width: 120px;">
                        <option value="">请选择城市</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">显示设置</label>
                <div class="layui-input-inline" style="width: 200px;">
                    <select name="status" id="">
                        <option value="1">每天一次</option>
                        <option value="2">每次打开</option>
                    </select>
                </div>

            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">登录状态</label>
                <div class="layui-input-inline" style="width: 200px;">
                    <select name="is_login" id="is_login">
                        <option value="1">无需登录</option>
                        <option value="2">需要登录</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">推荐类型</label>
                <div class="layui-input-inline" style="width: 200px;">
                    <select name="active_type" id="active_type">
                        <option value="0">选择类型</option>
                        <option value="1">无推荐</option>
                        <option value="2">推荐/未购买</option>
                        <option value="3">推荐/已购买</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" type="button" id="submits">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
    <script>
        layui.use(['form', 'laydate', 'upload'], function () {
            var form = layui.form;
            var laydate = layui.laydate;
            var upload = layui.upload;
            //执行实例
            var uploadInst = upload.render({
                elem: '#test1' //绑定元素
                , url: '{:url("upload")}' //上传接口
                , done: function (res) {
                    if (res.status == 1) {
                        $("#img_url").find('img').attr('src', res.data.file);
                        $("#img_url").find('input').val(res.data.file);
                        $("#img_url").show();
                        form.render();
                    }
                }
                , error: function (res1) {
                    console.log(res1);
                    //请求异常回调
                }
            });
            //墨绿主题
            laydate.render({
                elem: '#test6-1' //指定元素
                , type: 'datetime'
                , theme: 'molv'
                //,range: true
                , trigger: 'click'
            });

            laydate.render({
                elem: '#test6-2' //指定元素
                , type: 'datetime'
                , theme: 'molv'
                //,range: true
                , trigger: 'click'
            });

            form.on('checkbox', function (data) {
                var type = $(this).data('type');
                if (type == 'all') {
                    var child = $('.fa').find('.item_child');
                    child.each(function (index, item) {
                        item.checked = data.elem.checked;
                    });
                    form.render('checkbox');
                }
            });
            //监听提交
            $(document).on('click', '#submits', function () {
                $('form').submit();
            })
            form.on('select(province)', function(data){
                var province_id = data.value;
                if(province_id == 0){
                    $("#city_id").empty();
                    form.render('select');
                    return false;
                }
                $("#city_id").empty();
                $("#city_id").append('<option value=>请选择城市</option>');
                $.ajax({
                    url:'{:url("/admin/Franchisee/cityList")}',
                    async:true,
                    //dataType:'json',
                    type:'post',
                    data:{'province_id':province_id},
                    success:function(res){
                        $("#city_id").append(res);
                        form.render('select');
                    },
                    error:function(e){
                        layer.msg('请求错误');return false;
                    }
                })
            });
        });
    </script>
</block>
